import Vue from 'vue'
import VueRouter from 'vue-router'
import test from '../views/test.vue'
import login from '../views/login/index.vue'
import home from '../views/home/index.vue'
// 导入首页子路由
import my from '../views/home/my/index.vue'
import question from '../views/home/question/index.vue'
import find from '../views/home/find/index.vue'
import info from '../views/home/info/index.vue'
import editInfo from '../views/home/editInfo/edit.vue'
import shareList from '../views/home/shareList/index.vue'
import search from '../views/home/shareList/search.vue'
import shareDetail from '../views/home/shareDetail/index.vue'
import market from '../views/home/market/index.vue'
import interview from '../views/home/interview/index.vue'

// 导入token工具函数
import { getToken } from '../utils/token.js'
// 导入vant提示框
import { Toast } from 'vant'
// 导入vuex仓库
import store from '../store'
// 导入获取用户信息接口
import { getInfo } from '../api/login.js'

Vue.use(VueRouter)

const routes = [
  {
    path: '/test',
    name: 'test',
    component: test
  },
  {
    path: '/',
    redirect: '/login'
  },
  {
    path: '/login',
    name: 'login',
    component: login
  },
  {
    path: '/home',
    name: 'home',
    component: home,
    redirect: '/home/my',
    children: [
      {
        path: 'my',
        name: 'my',
        component: my,
        meta: {
          needLogin: true,
          needTab: true
        }
      },
      {
        path: 'question',
        name: 'question',
        component: question,
        meta: {
          needLogin: true,
          needTab: true
        }
      },
      {
        path: 'find',
        name: 'find',
        component: find,
        meta: {
          needTab: true
        }
      },
      {
        path: 'info',
        name: 'info',
        component: info,
        meta: {
          needLogin: true
        }
      }
    ]
  },
  {
    path: '/editInfo',
    name: 'editInfo',
    component: editInfo,
    meta: {
      needLogin: true
    }
  },
  // 面经分享页面
  {
    path: '/shareList',
    component: shareList
  },
  // 面经搜索
  {
    path: '/search',
    component: search
  },
  // 面经详情
  {
    path: '/shareDetail/:id',
    component: shareDetail,
    meta: {
      needUser: true
    }
  },
  // 市场数据
  {
    path: '/market',
    component: market
  },
  // 题目页面
  {
    path: '/interview/:type/:city',
    component: interview,
    meta: {
      needLogin: true
    }
  }
]

const router = new VueRouter({
  routes
})

// 添加前置导航守卫
router.beforeEach(async (to, from, next) => {
  from.meta.scrollTop =
    document.documentElement.scrollTop ||
    window.pageYOffset ||
    document.body.scrollTop
  // 判断跳转之后的路由元信息
  const needLogin = to.meta.needLogin
  const needUser = to.meta.needUser
  const token = getToken()
  // 判断页面是否需要登录
  if (needLogin) {
    // 需要则继续判断是否存在token
    if (token) {
      // token存在,继续判断vuex的state中是否有数据
      if (store.state.isLogin) {
        // 有数据则向下执行
        next()
      } else {
        // 如果没有则重新获取数据,传入token作为请求头参数
        const res = await getInfo(token)
        // 重新将数据写入vuex
        store.commit('setUser', res.data.data)
        store.commit('setIsLogin', true)
        next()
      }
    } else {
      // token不存在
      Toast.fail('请先登录')
      // 跳转页面之前先保存当前路由
      // console.log(to.fullPath)
      next('/login?to_path=' + to.fullPath)
    }
  } else {
    // 不需要则直接向下执行
    if (needUser) {
      if (token) {
        store.dispatch('upDateUser')
      }
    }
    next()
  }
})

// 添加后置导航守卫
router.afterEach((to, from) => {
  // 直接滚到顶部
  window.scrollTo(0, 0)
})

export default router
